
<template>



    <div>
        
        <el-steps :space="200" :active="add" align-center="true" finish-status="success" class="step">
            <el-step title="产品配置选择"></el-step>
            <el-step title="个人信息完善"></el-step>
            <el-step title="借款表填写"></el-step>
            <el-step title="个人信息审核通过"></el-step>
            <el-step title="上传材料"></el-step>
            <el-step title="材料通过"></el-step>
            <el-step title="待签合同"></el-step>
            <el-step title="合同签订待放款"></el-step>
        </el-steps>

      <el-row :gutter="30">
        <el-col :span="3"
          ><div class="grid-content bg-purple">&emsp;</div></el-col
        >
        
        <el-col :span="18">
          <el-form :model="userinfo" label-width="80px">

            <el-tabs type="border-card">
              <el-tab-pane>
                <span slot="label"><i class="el-icon-date"></i>合同基本信息</span>
                
                <el-form-item label="产品名称">
                  <el-input v-model="userinfo.productName"  :disabled="true" ></el-input>
                </el-form-item>

                <el-form-item label="借款审批额度">
                  <el-input v-model="userinfo.debitApproveLimit"  :disabled="true" ></el-input>
                </el-form-item>

                <el-form-item label="合同内容说明">
                  <el-input
                    v-model="userinfo.contractTemplateContent" :disabled="true" 
                  ></el-input>
                </el-form-item>
              </el-tab-pane>
            </el-tabs>
  
            <el-form-item>
              <el-button type="primary" @click="onSubmit">确认签订</el-button>
              <el-button type="primary" @click="quxao">取消签订</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        debitId:0,
        add:7,
        user: {
        },
        contract: {
          
        },
        userinfo: {
          
        },
        dialogFlag: false,
        titleWord: "",
        src: "",
        imageUrl:"",
        // agg:0,
        // loanTime:0,
        // productLoanAmount:0,
      };
    },
    methods: {
      onSubmit() {
        console.log(this.contract);
        this.$axios.post("contract/signed",this.contract).then((res) => {
            if (res.data.code == 200) {
            this.$message.error("新增合同成功!");
            } else {
            this.$message.error("操作错误");
            }
          });
      },
  //加载当前用户的借款申请表
  loadDebitList() {
      this.$axios.post("/debit/find",this.userAndPage).then((res) => {
        if (res.data.code == 200) {
          this.repayList = res.data.data.pageInfo.list;
          // console.log(this.repayList[0].debitId);
        } else {
          this.$message.error("操作错误");
        }
      });
    },
      
    
    
    loadUserinfo(id) {
        this.$axios
          .get("debit/updateDebit/"+id)
          .then((res) => {
            this.userinfo = res.data.data.debitVo;
            this.contract.debitId =this.userinfo.debitId;//借款表id
            this.contract.productId =this.userinfo.productId;//产品id
            this.contract.contractContent =this.userinfo.contractTemplateContent;
          });
      },

    },
 
    mounted() {
        this.user = JSON.parse(sessionStorage.getItem("user"));
        this.debitId = JSON.parse(localStorage.getItem("debitId"));
        console.log(this.debitId);
        this.loadUserinfo( this.debitId );
       
    },
    
  };
  </script>
  
  <style>
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
  </style>
 